/**
 * 动态载入js库组件
 * @author SPY
 * @description 用于动态载入js插件库
 * @date 2019/11/21
 */

import React from 'react';
import { message } from 'antd';
import PropTypes from 'prop-types';
import Script from 'react-load-script';

class DynamicScript extends React.Component {

  // 定义传入属性
  static propTypes = {
    name: PropTypes.string,  // 引入的插件库js的名称
    url: PropTypes.string.isRequired,   // 引入的插件库js的线上URL地址
  }

  // 定义传入属性的默认值
  static defaultProps = {
    name: null,
  }

  handleScriptCreate = () => {
    // message.success('插件库创建成功');
  }

  handleScriptError = (scriptName) => {
    message.warning(`${scriptName} 插件库引入失败`);
  }

  handleScriptLoad = () => {
    // message.success('插件库载入成功');
  }

  render() {
    const { name, url } = this.props;
    return (
      <Script
        // url="https://at.alicdn.com/t/font_353584_w5z8mjwl5k8.js"
        url={url}
        onCreate={this.handleScriptCreate}
        onError={() => this.handleScriptError(name)}
        onLoad={this.handleScriptLoad}
      />
    );
  }
}

export default DynamicScript;